Tweetを取り込むPopup menu

使い方

https://gyazo.com/9056568ab97b86fe33ee30fe1e9a49ef

URLが複数入っていたときは、その全てを変換する

install方法

code:import.js

import '/api/code/customize/Tweetを取り込むPopup menu/script.js';

他人のprojectからimportするのは安全上問題があるので、codeをコピペすることをおすすめします

その際ファイルパスを適宜変更して下さい

類似UserScript

参考にしたscript

TamperMonkeyが不要な代わりに、埋め込み用HTMLを毎回手動で取得しなくてはならない

テキストではなくtwitterのscreenshotを貼り付けるscript

本UserScriptと同様、TemperMonkeyを使って外部APIを叩きにいっている

以下code

code:script.js

import {insertText} from '/api/code/customize/scrapbox-insert-text/script.js';

import {convertWholeText} from '/api/code/customize/Tweetを取り込むPopup menu/convert.js';

scrapbox.PopupMenu.addButton({

title: '\uf081', // Font Awesomeでないと文字化けします

onClick: text => {

if (!/https:\/\/twitter\.com\S+\/status\/\d+/.test(text)) return; // URLがなければ何もしない

const cursor = document.getElementById('text-input')

Promise.all(text.split('\n').map(line => {

const matches = line.match(/^\s+|.*/g);

return convertWholeText(content, indent)

})).then(lines => insertText({text: lines.join('\n'), cursor: cursor}));

// 入力しやすいよう選択範囲を先に消しておく

return '';

},

});

tweet情報を整形して返す

code:convert.js

import {getTweetInfo} from '/api/code/customize/Tweetを取り込むPopup menu/getTweetInfo.js';

// 複数のURLを含んだテキストをまとめて変換する

export async function convertWholeText(text,indent) {

const tweetRegExp = /https:\/\/twitter\.com\S+\/status\/\d+(?:\?s=\d+)?/g;

const urls = text.match(tweetRegExp) ?? [];

if (urls.length === 0) return undefined;

const tweets = (await Promise.all(urls.map(url => getTweetInfo({tweetUrl: url}))))

.map(tweetInfo => convert({

tweetInfo,

indent,

}));

console.log(tweets);

let map = {};

for (const originalUrl of urls) {

const i = urls.indexOf(originalUrl);

}

//console.log(map);

//console.log(result);

return result;

}

引用の形を決めるところ

この関数をいじってお好みのformatにしてください　

code:convert.js

function convert({tweetInfo, indent}) {

return [

${indent}> \t${tweetInfo.signature}[${tweetInfo.date.href} ${tweetInfo.date.text}]

].join('\n');

}

tweet取得処理

code:getTweetInfo.js

export async function getTweetInfo({tweetUrl} = {}) {

if (!window.getTweetInfo) {

return;

}

try {

.then(req => req.response);

// 埋め込み用HTMLを解析する

const dummy = document.createElement('div');

dummy.insertAdjacentHTML('beforeend', tweet.html);

console.log(tweet.html);

// <blockquote>を取得

// 要素に分解

// tweet本文をscrapbox記法に変換

contentDOM?.getElementsByTagName('a')

contentDOM?.getElementsByTagName('br')

// 各種情報を詰め込んで返す

return {

author: {

name: tweet.author_name,

url: tweet.author_url,

},

content: contentDOM?.textContent.split('\n'),

signature: signatureDOM?.textContent,

date : {

href: dateDOM?.href,

text: dateDOM?.textContent,

},

};

} catch(e) {

console.error(e);

}

}

TemperMonkeyに貼り付けるコード

code:temperMonkey.js

// ==UserScript==

// @name twitter-info-proxy

// @version 0.1

// @description fetch the information of a tweet

// @author takker

// @connect publish.twitter.com

// @grant GM_xmlhttpRequest

// @license MIT

// @copyright Copyright (c) 2020 takker

// ==/UserScript==

;(function () {

"use strict"

unsafeWindow.getTweetInfo = (url) => {

const u = new URL(url)

throw Error("unexpected url!")

}

return new Promise((r) => {

GM_xmlhttpRequest({

method: "GET",

url,

onload: (res) => r(res),

withCredentials: true,

responseType: "json",

})

})

}

})()

UserScript.icon